<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>文字组件</title>
    
    <link rel="stylesheet" type="text/css" href="../../dist/css/hisui.pure.min.css"></link>
    <script type="text/javascript" src="../../dist/js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="../jquery-tag-demo.js"></script>
    <script type="text/javascript" src="../../dist/js/jquery.hisui.min.js"></script>
    <script type="text/javascript" src="../../dist/js/locale/hisui-lang-zh_CN.js"></script>	
    <script type="text/javascript" src="../mock-min.js"></script>
    <link rel="stylesheet" type="text/css" href="../demo.css">
    
    <script type="text/javascript">
        var HISUIStyleCode = 'pure';
    </script>
</head>
<body>
    <style>
		.demo-exp-code td{padding:5px 0;}
		.demo-exp-code td.r-label{padding-right: 10px;}
	</style>
	<h2>基础文字组件</h2>
	<h3>说明:</h3>
    <span>基础文字组件（label）用来实现翻译，固定间距及加红星功能 。</span>
	<h3>如：</h3>
	<div class="demo-exp-code entry-content">
		<div class="use-prettyprint lang-html"> 
		<div class="hisui-panel" title="文字组件示例" style="width:500px;padding:10px;" data-options="headerCls:'panel-header-gray',iconCls:'icon-paper',closable:false,collapsible:true,minimizable:false,maximizable:true">
			<table>
				<tr>
					<td class="hisui-label" data-options="required:true">姓名</td>
					<td>
						<input class="hisui-validatebox textbox" data-options="required:true,validType:'length[3,10]'">
					</td>
				</tr>
				<tr>
					<td class="hisui-label">生日</td>
					<td>
						<input class="hisui-datebox textbox">
					</td>
				</tr>
			</table>
		</div>
		</div>
	</div>
	<table class="table">
		<tr class="protitle">
			<th>属性</th>
			<th>说明</th>
			<th>默认值</th>
			<th></th>
		</tr>
		<tr>
			<td>required</td>
			<td>是否加红星符号</td>
			<td>false<code>2024-03-08</code></td>
			<td></td>
		</tr>
		<tr>
			<td>notTrans</td>
			<td>是否自动翻译,true表示不自动翻译</td>
			<td>false<code>2024-03-08</code></td>
			<td></td>
		</tr>
		<tr>
			<td>styleCss</td>
			<td>附加样式类名，默认'r-label'表示与右边元素保留10px间距</td>
			<td>r-label<code>2024-03-08</code></td>
			<td></td>
		</tr>
	</table>
	<prettyprint/>	
</body>
</html>